import './App.css'
import React, { useEffect } from 'react'
import { useRoutes, useNavigate, useLocation } from 'react-router-dom'
import { routerFn } from './router/index'
// import axios from 'axios'
import Detail from './views/news/Detail'
import News from './views/news/News'

function ToLogin() {
  const navigateTo = useNavigate()
  useEffect(() => {
    navigateTo('/login')
  })
  return <div></div>
}

function ToPage1() {
  const navigateTo = useNavigate()
  useEffect(() => {
    navigateTo('/')
  })
  return <div></div>
}

function BeforeEach() {
  const location = useLocation()
  console.log(location, '789798')
  const BackRouteList = JSON.parse(localStorage.getItem('BackRouteList')) || []
  const routes = routerFn(BackRouteList)
  const outlet = useRoutes(routes)
  let token = localStorage.getItem('xinwen-token')
  // if (location.pathname == '/news') {
  //   return <News />
  // }
  // // startsWith('a')
  // if (location.pathname.startsWith('/detail/')) {
  //   return <Detail />
  // }

  if(  location.pathname == '/news' || location.pathname.startsWith('/detail/')){
    return outlet
  }
  if (location.pathname === '/login' && token) {
    return <ToPage1 />
  }
  if (location.pathname !== '/login' && !token) {
    return <ToLogin />
  }
  return outlet
}

export default function App() {
  // const [routes, setRoutes] = useState([])
  // useEffect(() => {
  //   Promise.all([
  //     axios.get('/rights'),
  //     axios.get('/children'),
  //   ]).then((res) => {
  //     let BackRouteList = [...res[0].data, ...res[1].data]
  //     let routes=  routerFn(BackRouteList)
  //     setRoutes(routes)
  //   })
  // }, [])

  // const Outlet = useRoutes(routes)

  return <BeforeEach />
}
